<%- include('../layout/head.ejs')%>

<!-- 生产环境版本，优化了尺寸和速度 -->
<link rel="stylesheet" type="text/css" href="/layui/css/layui.css" />
<script src="/layui/layui.all.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
  <%- include('../common/navigation.ejs')%>

  <main>
    <div class="theme-title-wrap">
      <div class="theme-title">
        <h1 class="banner">管理员商品列表</h1>
      </div>
    </div>

    <div class="search-wrap">
      <div class="search">
        <form class="layui-form" action="">
          <div class="layui-form-item">
            <label class="layui-form-label">商品搜索</label>
            <div class="layui-input-block">
              <input type="text" name="title" required lay-verify="required" placeholder="请输入商品关键字" autocomplete="off"
                class="layui-input">
            </div>
          </div>
          <div class="layui-form-item">
            <div class="layui-input-block">
              <button class="layui-btn" lay-submit lay-filter="formDemo" style="background-color: #f10215;">立即搜索</button>
              <button type="reset" class="layui-btn layui-btn-primary">重置</button>
              <a class="layui-btn add-product-btn" style="background-color: #f10215; margin-left: 40px;" href="/admin/add-product">添加新的商品</a>
            </div>
          </div>
        </form>
      </div>
    </div>

    <div class="product-list-wrap">
      <div class="product-list">

        <table class="layui-table" id="js-click-table">
          <colgroup>
            <col width="150">
            <col width="200">
            <col>
          </colgroup>
          <thead>
            <tr>
              <th>图片</th>
              <th>产品名字</th>
              <th>编辑</th>
              <th>删除</th>
              <th>库存</th>
              <th>进货价</th>
              <th>售价</th>
              <th>已售数量</th>
              <th>介绍</th>
              <th>大分类</th>
              <th>详细分类</th>
              <th>标签</th>
            </tr>
          </thead>

          <tbody>
            <%if(prods.length > 0) {%>
            <% for(let product of prods) { %>
            <tr>
              <!-- 图片 -->
              <td><img src="<%= qiniuImgUrl + product.pImgUrlKey %>" alt="<%= product.pName %>" /></td>
              <!-- 产品名 -->
              <td><%=product.pName %></td>
              <!-- 编辑按钮 -->
              <td><a class="btn" href="/admin/edit-product/<%= product.pid%>?edit=true&name=tom">编辑</a></td>
              <!-- 删除按钮 -->
              <td>
                  <button class="btn" id="deleteBtn" name="deleteBtn" data-id="<%= product.pid %>">删除</button>
              </td>
              <!-- 库存 -->
              <td><%=product.pReserve %></td>
              <!-- 进货价 -->
              <td><%=product.pBuyInPrice %></td>
              <!-- 售价 -->
              <td>￥ <%=product.pPrice %></td>
              <!-- 已售数量 -->
              <td><%=product.pPurchased %></td>
              <!-- 介绍 -->
              <td><%=product.pIntro %></td>
              <!-- 大分类 -->
              <td><%=product.pBigSort %></td>
              <!-- 详细分类 -->
              <td><%=product.pDetailSort %></td>
              <!-- 标签 -->
              <td><%=product.pTag %></td>



            </tr>

          </tbody>
          <% }%>
          <%} else { %>
          <h2>没有任何产品</h2>
          <%}%>
        </table>

        </div>
    </div>
  </main>
  <%- include('../layout/foot.ejs') %>